<template>
  <div class="app-container">
    <!-- <strategy-form/> -->
    <strategy-filter @on-filter="submitFilterForm"/>
    <div style="padding: 10px 0;">
      <el-button-group>
        <el-button v-if="roleCheck('add')" type="danger" size="mini" @click="openDialog({dialogName:staticDialogName})">
          新增层级风控
        </el-button>
      </el-button-group>
    </div>
    <el-table
      :data="tableData.list"
      v-loading="loading"
      element-loading-text="加载中..."
      class="el-table-align-center">
      <el-table-column label="策略生成时间" prop="createTime" width="160px">
        <template slot-scope="{row}">{{row.createTime | toTime}}</template>
      </el-table-column>
      <el-table-column label="层级" width="120px" prop="levelName">
      </el-table-column>
      <el-table-column label="单日提现金额>" width="120px" prop="dailyAmount">
      </el-table-column>
      <el-table-column label="单次提现金额>" width="120px" prop="amount">
      </el-table-column>
      <el-table-column label="当日提现次数>" width="140px" prop="dailyTimes">
      </el-table-column>
      <el-table-column label="首次提现金额>" width="140px" prop="firstAmount">
      </el-table-column>
      <el-table-column label="当日盈利金额>" width="120px" prop="dailyProfit">
      </el-table-column>
      <el-table-column label="7天累计提现金额>" width="120px" prop="weeklyAmount">
      </el-table-column>
      <el-table-column label="同IP状态" width="120px" prop="sameIpCheck">
        <template slot-scope="{row}">
          {{row.sameIpCheck | toConverter('WITHDRAW_RISK_CREDIT_STATUS')}}
        </template>
      </el-table-column>
      <el-table-column label="同设备状态" width="120px" prop="sameDeviceCheck">
        <template slot-scope="{row}">
          {{row.sameDeviceCheck | toConverter('WITHDRAW_RISK_CREDIT_STATUS')}}
        </template>
      </el-table-column>
      <el-table-column label="状态" prop="status">
        <template slot-scope="{row}">
          {{row.status | toConverter('WITHDRAW_RISK_STATUS')}}
        </template>
      </el-table-column>
      <el-table-column label="操作" fixed="right" width="180px">
        <template slot-scope="{row}">
          <el-button v-if="roleCheck('switch')"
                     type="text"
                     @click="setStatus(1);openDialog({dialogName: staticDialogName2, props: row })"
          >启用
          </el-button>
          <el-button v-if="roleCheck('switch')"
                     type="text"
                     @click="setStatus(0);openDialog({dialogName: staticDialogName2, props: row })"
          >停用
          </el-button>

          <el-button v-if="roleCheck('edit')"
                     type="text"
                     @click="openDialog({dialogName: staticDialogName, props: row })">编辑
          </el-button>
          <el-button v-if="roleCheck('del')"
                     type="text"
                     @click="setStatus(2);openDialog({dialogName: staticDialogName2, props: row })">删除
          </el-button>

        </template>
      </el-table-column>
    </el-table>

    <div class="pagination-container">
      <el-pagination background @size-change="gridSizeChange" @current-change="gridCurrentChange"
                     :current-page="filters.page" :page-sizes="gridPageSize" :page-size="filters.size"
                     :layout="gridLayout" :total="tableData.total">
      </el-pagination>
    </div>
    <strategy-setting-dialog
      v-if="dialogName === staticDialogName"
      v-model="dialogVisible"
      :row-data="dialogProps"
      :id="dialogProps.id"
      @submit="submitFinished"/>
    <strategy-status-dialog
      v-if="dialogName === staticDialogName2"
      v-model="dialogVisible"
      :row-data="dialogProps"
      :id="dialogProps.id"
      :status="status"
      @submit="submitFinished"/>
  </div>
</template>


<script>
  import {getRiskStrategyList} from "@/services/api/strategy";
  import {form, grid, dialog} from '@/build'
  import strategyForm from "./strategyForm";
  import StrategyFilter from "./strategyFilter";
  import StrategySettingDialog from "./strategySettingDialog";
  import StrategyStatusDialog from "./strategyStatusDialog";

  export default {
    name: "withdraw-strategy",
    components: {StrategyStatusDialog, StrategySettingDialog, StrategyFilter, strategyForm},
    mixins: [form, grid, dialog],
    data() {
      return {
        tableData: {},
        filters: {
          limit: 20,
          page: 1,
          startTime: moment().format('YYYY-MM-DD 00:00:00'),
          endTime: moment().format('YYYY-MM-DD 23:59:59'),
        },
        dialogVisible: false,
        staticDialogName: 'exception-withdraw-dialog',
        staticDialogName2: 'strategy-status-dialog',
        status: '',
      }
    },
    methods: {
      submitFilterForm(formInline) {
        const {date} = formInline;
        let startTime = undefined,
          endTime = undefined;
        if (!_.isUndefined(date) && _.isArray(date)) {
          startTime = formInline.date[0];
          endTime = formInline.date[1];
          formInline = {...formInline, startTime, endTime};
        } else {
          this.filters.startTime = undefined;
          this.filters.endTime = undefined;
        }
        this.filters = {...this.filters, ...formInline};
        this.gridSearch();
      },
      setStatus(status) {
        this.status = status
      }
    },
    mounted() {
      this.bindGet(getRiskStrategyList, "tableData", {
        action: "getGrid",
        sendingData: "filters"
      });

      this.getAll();
    },
  }
</script>

<style scoped>

</style>
